<template>
  <div>
    <!-- <h1>App根组件</h1>
    <button @click="tagger">切换</button> -->
    <!-- <a href="#/MyTest">MyTest</a><br>
    <a href="#/MyTest1">MyTest1</a><br>
    <a href="#/MyTest2">MyTest2</a> -->
    <!-- <van-cell title="显示分享面板" @click="showShare = true" />
<van-share-sheet
  v-model:show="showShare"
  title="立即分享给好友"
  :options="options"
  @select="onSelect"
/> -->
    <van-button type="primary" @click="showNum">主要按钮</van-button><br>
    <!-- <router-link to="/MyTest">MyTest</router-link><br>
    <router-link to="/MyTest1">MyTest1</router-link><br>
    <router-link to="/MyTest2">MyTest2</router-link><br> -->
    <!-- <component :is="cmpName"></component> -->
    <!-- <router-link to="/move/1">MyMove</router-link><br>
    <router-link to="/move/2">MyMove</router-link><br>
    <router-link to="/move/3">MyMove</router-link> -->
    <!-- <router-view></router-view> -->
    <div id="h_center1">
        <span>当前播放：</span>
        <span>大鱼海棠</span>
        <audio id="now_music" src="http://m701.music.126.net/20230104154657/8e5b3e655ee66dd70ae…96453520/c716/5067/7067/804ba24aaf92e2bf77dd6a70af9e62d4.mp3"></audio>
    </div>
    <textarea id="lrc_content" name="textfield" cols="70" rows="10">

    </textarea>

    <ul id="text" style="overflow: hidden;">

    </ul>
  </div>
</template>

<script>
import MyTest from './components/test.vue'
import MyTest1 from './components/test1.vue'
import MyTest2 from './components/test2.vue'
import MyMove from './components/move.vue'
export default {
  name: 'App',
  components: {
    MyTest,
    MyTest1,
    MyTest2,
    MyMove
  },
  data() {
    return {
      cmpName: 'MyTest',
      musicTitle: ''
    }
  },
  
  created() {
    window.onhashchange = () => {
      let hash = location.hash.split('/')[1]
      // console.log(hash)
      this.cmpName = hash
    }
    let hash = location.hash.split('/')[1]
    // console.log(hash)
    this.cmpName = hash
  },
  methods: {
    tagger() {
      this.cmpName = 'MyTest1'
    },
    showNum() {
      // console.log(123)
      this.$http({
        url: 'lyric?id=33894312'
      }).then(res => {
        console.log(res.data.lrc.lyric)
        this.musicTitle = res.data.lrc.lyric
        
        let list = this.musicTitle.split(']')
        for (let i = 0; i < list.length; i++) {
          console.log(list[i].split('['))
          // console.log(list)
        }
      })
    }
  }
}
</script>

<style>
  .router-link-active {
    color: red;
    background-color: blue;
  }
</style>